

/* 图表布局 */
.body-content {
  width: 96vw;
  height: 89vh;
  //height: 100%;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  position: absolute;
  top: 6vh;
  bottom: 4vh;
  left: 2vw;
  right: 0;
  /* layout -  layout2 */
  .layout-flex {
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
  }

  // index
  .flex-row {
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;

    .flex-cell {
      -webkit-flex: 1;
      -ms-flex: 1;
      flex: 1;
      padding: 0 0px;
    }

    .flex-cell-l, .flex-cell-r {
      -webkit-flex: 2;
      -ms-flex: 2;
      flex: 2;
    }

    .flex-cell-c {
      -webkit-flex: 3;
      -ms-flex: 3;
      flex: 3;
    }

    .flex-cell-lc {
      -webkit-flex: 5;
      -ms-flex: 5;
      flex: 5;
    }

    .chart-title {
      height: 30px;
      font-size: 2rem;
      font-weight: normal;
      color: #5ac8fa;
    }

    .chart-wrapper {
      position: relative;
      height: 100%;

      .chart-div {
        position: absolute;
        top: 20px;
        bottom: 0;
        left: 0;
        right: 0;
        border-style: solid;
        border-width: 26px 27px 27px;
        border-image: url("../imgs/chart-wrapper.png") 26 27 27 fill / 1 / 0 repeat;
      }

      .content-wrap {
        position: absolute;
        top: 10px;
        bottom: 0;
        left: 0;
        right: 0;
      }
    }

  }
}

.body-content{
  .chart-wrapper{
    // 一半
    .wrap-h4{
      height: 40%;
    }
    .wrap-h6{
      //margin-top: 40%;
      height: 65%;
      position: absolute;
      top: 35% !important;

    }
    .content-wrap{
      //background: rgba(0,0,0,.5);

      .chart-title{
        color: #fafafa;
        font-size: 1.6rem;
      }
      .chart-body{
        height: calc(100% - 2rem);
      }
    }

    .chart-new{
      position: absolute;
      top: 20px;
      bottom: 0;
      left: 0;
      right: 0;
      padding: 10px;
      //border-style: solid;
      //border-width: 26px 27px 27px;
      //border-image: url("../imgs/chart-wrapper.png") 26 27 27 fill / 1 / 0 repeat;
    }
 // 地图信息
    .map-info{
      width: 200px;
      position: absolute;
      top: -10px;
      .info-title{
        font-size: 1.6rem;
        color: #13a1ea;
      }
      .info-number{
        font-size: 3rem;
        line-height: 4rem;
        color: #ff9a00;
        font-weight: bold;
        .info-unit{
          font-size: 2rem;
          color: #13a1ea;
          font-weight: 400;
        }
      }

    }
    .map-right{
      position: absolute;
      top: -10px;
      right: 10px;
      text-align: right;
      .info-other{
        font-size: 1.6rem;
        color: #13a1ea;
      }
      .info-rate{
        font-size: 2.6rem;
        font-weight: bold;
        color: #13a1ea;
        .info-unit{
          font-size:2rem;
          color: #13a1ea;
          font-weight: 400;
        }
      }
    }
  }
}


